<template>
	<view class="login_main">
		<app-header title="修改密码"></app-header>
		<view class="logo flex-c">
			<u-image src="/static/images/logo.png" mode="aspectFit" width="430rpx" height="430rpx"></u-image>
		</view>

<!-- 		<view class="input flex-s">
			<input v-model="form.oldPassword" placeholder="输入原密码" :password="!showPwd1"
				:class="[form.oldPassword.length>0&&android&&!showPwd1?'android':'']" />
			<u-image :src="showPwd1?'/static/images/show.png':'/static/images/hide.png'" mode="aspectFit" width="48rpx"
				height="48rpx" @click="showPwd1=!showPwd1"></u-image>
		</view> -->
		<view class="input flex-s">
			<input v-model="form.newPassword" placeholder="请输入新密码（6-20位数字/大小写字母）" :password="!showPwd2"
				:class="[form.newPassword.length>0&&android&&!showPwd2?'android':'']" />
			<u-image :src="showPwd2?'/static/images/show.png':'/static/images/hide.png'" mode="aspectFit" width="48rpx"
				height="48rpx" @click="showPwd2=!showPwd2"></u-image>


		</view>
		<view class="input flex-s">
			<input v-model="form.newPasswordRe" placeholder="请再次输入新密码" :password="!showPwd3"
				:class="[form.newPasswordRe.length>0&&android&&!showPwd3?'android':'']" />
			<u-image :src="showPwd3?'/static/images/show.png':'/static/images/hide.png'" mode="aspectFit" width="48rpx"
				height="48rpx" @click="showPwd3=!showPwd3"></u-image>

			<!-- 	<u-input :type="showPwd3?'text':'password'" v-model="form.newPasswordRe" placeholder="请再次输入新密码"
				border="none" clearable>
				<template slot="suffix">
					<u-image :src="showPwd3?'/static/images/show.png':'/static/images/hide.png'" mode="aspectFit"
						width="48rpx" height="48rpx" @click="showPwd3=!showPwd3"></u-image>
				</template>
			</u-input> -->
		</view>
		<view class="tip">密码规则：8~16位，数字、大小写字母或特殊字符</view>
		<view class="forget"></view>
		<view class="btn" @click="submit">提交</view>
		<!-- 		<view class="port flex-c">
			<u-checkbox-group v-model="isRead" shape="circle" activeColor="#0055A6">
				<u-checkbox label="请阅读并同意" name="请阅读并同意">
				</u-checkbox>
			</u-checkbox-group>
			<view class="port_t"  @click="$func.navigateTo" :data-url="'/pages/common/agreement'">《用户服务协议》</view>
		</view> -->

	</view>
</template>

<script>
	const systemInfo = uni.getSystemInfoSync();
	import { setToken } from '@/utils/auth'
	var timer = null
	export default {
		components: {

		},
		data() {
			return {
				android: systemInfo.platform == 'android',
				isRead: [],
				form: {
					username: "",
					newPassword: "",
					newPasswordRe: ""
				},
				info: {},
				sending: false,
				time: 0,
				showPwd1: false,
				showPwd2: false,
				showPwd3: false,
				type: 0,
				weChatCode: "",
			}
		},

		onBackPress(event) {

		},

		onLoad(options) {
			this.$set(this.form,'username',options.username)
			this.$set(this.form,'code',options.code)
		},
		methods: {



			close() {
				this.$emit('login', {})
			},

			submit() {


				// if (!this.form.oldPassword) {
				// 	uni.showToast({
				// 		title: "请输入原始密码",
				// 		duration: 2000
				// 	});
				// 	return
				// }
				if (!this.form.newPassword) {
					uni.showToast({
						title: "请输入新密码",
						duration: 2000,
						icon: "none",
					});
					return
				}
 
				if (!this.form.newPasswordRe) {
					uni.showToast({
						title: "请再次输入新密码",
						duration: 2000,
						icon: "none",
					});
					return
				}
				if (this.form.newPassword != this.form.newPasswordRe) {
					uni.showToast({
						title: "两次密码不一致",
						duration: 2000,
						icon: "none",
					});
					return
				}
				uni.showModal({
					title: '提示',
					content: '确定修改密码？',
					success: (res) => {
						if (res.confirm) {
							this.$http.put("/crm/account/resetPwd",
								this.form).then(res => {
								uni.showToast({
									title: "修改成功",
									duration: 2000,
									icon: "none",
								});
								uni.navigateBack({
									delta: 2
								})
							})
						} else if (res.cancel) {

						}
					}
				});


			},



		},
		onPullDownRefresh() {

		},
		onReachBottom() {


		}
	}
</script>

<style scoped lang="scss">
	.login_main {
		background-color: #fff;
		padding: 24rpx;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		display: flex;

		.logo {
			width: 430rpx;
			height: 430rpx;
		}

		.input {
			padding: 24rpx;
			border-bottom: 1px solid #EDEDED;
			width: calc(100% - 60rpx);
			margin: 0 30rpx;

			input {
				flex: 1;
				height: 64rpx;
				font-size: 30rpx;

				&.android {
					font-size: 20rpx;
				}
			}

			::v-deep input {
				height: 64rpx;
				font-size: 30rpx;

				&.android {
					font-size: 20rpx;
				}
			}
		}

		.forget {
			font-weight: 500;
			color: #0055A6;
			text-align: right;
			font-size: 24rpx;
			margin-bottom: 96rpx;
			width: 100%;
		}

		.btn {
			width: 540rpx;
			height: 88rpx;
			background: #0055A6;
			border-radius: 24rpx;
			border: 1px solid #0055A6;
			font-size: 30rpx;
			font-weight: 500;
			color: #FFFFFF;
			align-items: center;
			justify-content: center;
			display: flex;
			margin: 0 auto 32rpx;

			&.reg {
				background: #FFFFFF;
				color: #0055A6;
			}
		}

		.login {
			display: flex;
			align-items: center;
			font-size: 28rpx;
			color: #999999;
			line-height: 28rpx;
		}

		button {
			background-color: rgba(0, 0, 0, 0);
			display: flex;
			justify-content: center;
			align-items: center;
			border-color: transparent;
			border-style: none;
			// background: rgba(24, 139, 126, 1);

			font-size: 28rpx;
			line-height: 28rpx;
			color: #999999;
		}

		button::after {
			border: none;
		}



	}

	.code_btn {
		min-width: 208rpx;
		height: 65rpx;
		background: #0055A6;
		border-radius: 33rpx;
		color: #fff;
		padding: 0 20rpx;

		&.disabled {
			background: #EFEFEF;
			color: #999999;
		}
	}

	.port {
		margin-top: 38rpx;
		font-size: 28rpx;
		font-weight: 400;
		color: #FFFFFF;
		display: flex;

		.port_t {
			color: rgb(41, 121, 255);
		}
	}

	.tip {
		font-size: 28rpx;
		color: #666666;
		text-align: center;
		margin-top: 25rpx;
	}
</style>